<template>
  <div style="background-color: #000;">
    <section class="content_1">
      <div class="container">
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <div v-if="rzstatus!==2&&rzstatus!==''" v-cloak>
              <el-alert type="warning" class="alert-warning">
                <div class="warning">
                  <img src="../../../static/tingxingrz.png" alt="" style="
                float:left;
                    width: 20px;
                    height: 20px;
                    margin-top: 1px;
                  " />
                  <div class="alert_text">
                    您当前尚未实名认证，请进行实名认证，享受更多实名权益。
                    <a href="#" class="a_text" @click="goUrl('/detailInfoto', 'detailInfoto')"
                      style="color:#ff7226">立即实名认证</a>
                  </div>
                </div>
              </el-alert>
            </div>
          </el-col>
        </el-row>
        <!-- 面包屑start -->
        <el-breadcrumb separator="/" class="breadCrumb_Box">
          <el-breadcrumb-item><a @click="goUrl('/signatureSuper', 'signatureSuper')">超级签名</a></el-breadcrumb-item>
          <el-breadcrumb-item>{{c_breadCrumb_name}}</el-breadcrumb-item>
        </el-breadcrumb>
        <!-- <breadcrumb></breadcrumb> -->
        <!-- 面包屑end -->

        <el-row class="tac content">
          <el-col :xs="24" :sm="24" :md="24" :lg="4" :xl="4">
            <Navmenu @handleClick="handleClick"></Navmenu>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="20" :xl="20">
            <div v-if="active==0">
              <upfileSuper isvip="1"></upfileSuper>
            </div>
            <div v-if="active==1">
              <appSuper></appSuper>
            </div>
            <div v-if="active==2">
              <p8Account></p8Account>
            </div>
            <div v-if="active==3">
              <downlist_all></downlist_all>
            </div>
          </el-col>
        </el-row>
      </div>
      <statement></statement>
    </section>
  </div>
</template>

<script>
  import Navmenu from "@/components/signatureSuperMember/menu";
  import appSuper from "@/components/signatureSuperMember/app";
  import authCode from "@/components/signatureSuperMember/authCode";
  import p8Account from "@/components/signatureSuperMember/p8Account";
  import downlist_all from "@/components/signatureSuperMember/downlist_all";
  import upfileSuper from "@/components/signatureSuperMember/upfileSuper.vue";
  import statement from "@/components/common/statement";
  export default {
    components: {
      Navmenu,
      upfileSuper,
      appSuper,
      authCode,
      downlist_all,
      p8Account,
      statement
    },
    data() {
      return {
        url1: "../../../static/应用撸码.png",
        url2: "../../../static/应用公安.png",
        url3: "../../../static/上传应用.png",
        tabPosition: "left",
        c_breadCrumb_name: "应用列表",
        // 记录当前tab页
        active: 1,
        rzstatus: '', //实名状态
      };
    },
    mounted() {

    },

    methods: {

      goUrl(path, name) {
        if (name == "signatureSuper") {
          location.reload();
        }
        this.$router.push({
          path: path,
          name: name,
        });
      },

      handleClick(index) {
        this.active = index
        if (this.active == 0) {
          this.c_breadCrumb_name = "上传应用";
        } else if (this.active == 1) {
          this.c_breadCrumb_name = "应用列表";
        } else if (this.active == 3) {
          this.c_breadCrumb_name = "下载明细";
        } else {
          this.c_breadCrumb_name = "P8开发账号";
        }
      },
      //实名状态
      getList() {
        this.$post(this.API.UserMsg).then((res) => {
          console.log(res);
          let data = res.data;
          this.rzstatus = data.rzstatus;
          // console.log(this.rzstatus);
        })
      }
    },
    //生命周期 - 创建完成（可以访问当前this实例）
    created() {
      var token_time = sessionStorage["token_time"];
      token_time = parseInt(token_time);
      token_time = token_time + 3600000;
      var now = new Date().getTime();
      if (token_time < now || token_time == undefined || isNaN(token_time)) {
        console.log("未登录");
        //跳转到登录;
        sessionStorage.setItem("currentTab_title", "");
        this.$router.push({
          path: "/login",
          name: "login",
        });

        return;
      }

      if (sessionStorage.getItem('setMenuIndex_supuer') != null) {
        this.active = sessionStorage.getItem('setMenuIndex_supuer')
        if (this.active == 0) {
          this.c_breadCrumb_name = "上传应用";
        } else if (this.active == 1) {
          this.c_breadCrumb_name = "应用列表";
        } else if (this.active == 3) {
          this.c_breadCrumb_name = "下载明细";
        } else {
          this.c_breadCrumb_name = "P8开发账号";
        }
      }
      this.getList();

    },
  }

</script>
<style scoped>
  button {
    border: none;
  }

  .flexbox {
    display: flex;
  }

  .flex2 {
    flex: 2;
  }

  .flex2 {
    flex: 1;
  }

  .flex2 h3 {
    color: red;
    margin-top: 40px;
  }

  .flex2 .text1 {
    max-width: 700px;
    font-size: 18px;
    color: #fff;
    letter-spacing: 2px;
    line-height: 30px;
  }

  .flex2 p {
    color: #fff;
    line-height: 35px;
  }

  .flex1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .flex1 img {
    margin: 0px 20px;
  }

  .flex1 img:first-child {
    width: 54pt;
  }

  .flex1 img:last-child {
    width: 63pt;
  }

  .text span {
    font-size: 30px;
    color: #85b7ff;
    margin-left: 20px;
  }

  .text p {
    font-size: 16px;
    color: #85b7ff;
  }

  .tab {
    min-height: 55vh;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
    /* border:1px solid; */
    margin: 20px 0px 30px 0px;
    background-color: #fff;
    border-radius: 8px;
  }

  /* 面包屑 */
  .breadCrumb_Box {
    margin: 30px 0px 0px 0px;
  }

  .app-img {
    width: 18px;
    color: #000;
    margin: -3px 6px 0px 0px;
  }

  .content {
    margin: 20px 0px 30px 0px;
    background: rgba(30, 30, 30, 0.8);
    box-shadow: 0px 4px 10px 2px rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    overflow: hidden;
  }

  .alert-warning {
    display: block;
  }

  div>>>.el-alert--warning.is-light {
    padding: 0px;
  }

  div>>>.el-alert .el-alert__description {
    margin: 0px;
  }

  .warning {
    height: 40px;
    text-align: left;
    width: 100%;
    padding: 5px 3px;
    padding-top: 8px;
  }

  div>>>.el-alert__content {
    display: block;
  }

  .warning .alert_text {
    color: #fff;
    line-height: 30px;
    font-size: 14px;
    padding-left: 4px;
    text-align: left;
    display: inline-block;
    width: calc(100% - 100px);
  }

  .el-alert--warning.is-light {
    background-color: rgba(30, 30, 30, 0.8);
  }

  .alert_text {
    font-size: 14px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #c0a375;
    margin-top: -3px;
    margin-left: 5px;
  }

  .a_text {
    font-size: 14px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #71b7ec;
    margin-top: -2px;
  }

  a {
    text-decoration: none;
  }

  div>>>.el-alert__content .el-alert__closebtn {
    font-size: 18px;
    color: #ff762c;
    margin-top: 0px;
  }

  /* 媒体查询 */

  @media (max-width: 576px) {
    .flex1 {
      display: none;
    }
  }

  @media (max-width: 414px) {
    .alert_text {
      font-size: 12px;

    }

    .a_text {
      font-size: 12px;
    }
  }

  .breadCrumb_Box>>>.el-breadcrumb__inner a {
    color: #ee7829;
  }

  .breadCrumb_Box>>>.el-breadcrumb__item .el-breadcrumb__separator {
    color: #fff;
  }

  .breadCrumb_Box>>>.el-breadcrumb__item .el-breadcrumb__inner {
    color: #fff;
  }

</style>
